<template>
	<view class="forget">
		<view class="content">
			<!-- 主体 -->
			<view class="main">
				<view class="tips">若你忘记了密码，可在此重置新密码。</view>
				<wInput v-model="phoneData" type="text" maxlength="11" placeholder="请输入手机号码"></wInput>
				<wInput v-model="passData" type="password" maxlength="11" placeholder="请输入新密码" isShowPass></wInput>

				<wInput v-model="verCode" type="number" maxlength="4" placeholder="验证码" isShowCode codeText="获取重置码" ref="runCode" @setCode="getVerCode()"></wInput>
			</view>

			<wButton text="重置密码" :rotate="isRotate" @click.native="startRePass()"></wButton>
		</view>
	</view>
</template>

<script>
var _this
import wInput from '../../components/watch-login/watch-input.vue' //input
import wButton from '../../components/watch-login/watch-button.vue' //button
export default {
	data() {
		return {
			phoneData: '', //电话
			passData: '', //密码
			verCode: '', //验证码
			isRotate: false //是否加载旋转
		}
	},
	components: {
		wInput,
		wButton
	},
	mounted() {
		_this = this
	},
	methods: {
		getVerCode() {
			//获取验证码
			if (_this.phoneData.length !== 11) {
				uni.showToast({
					icon: 'none',
					position: 'bottom',
					title: '手机号不正确'
				})
				return false
			}
			console.log('获取验证码')
			const params = {
				phone: _this.phoneData
			}
			_this.isRotate = true
			this.$api.getSMSCode(params)
				.then(res => {
					if (res.success) {
						//触发倒计时（一般用于请求成功验证码后调用）
						this.$refs.runCode.$emit('runCode')
						uni.showToast({ title: '验证码已发送', icon: 'success' })
						// setTimeout(() => {
						//   uni.navigateTo({
						//       url: '../login/login'
						//   })
						// }, 1000)
					} else {
						uni.showToast({ title: res.msg, icon: 'none' })
					}
					_this.isRotate = false
				})
				.catch(err => {
					console.log('request fail', err)
				})

			// setTimeout(function() {
			// 终止倒计时（用于突然需要终止倒计时的场景）
			// _this.$refs.runCode.$emit('runCode', 0)
			// }, 3000)
		},
		startRePass() {
			//重置密码
			if (this.isRotate) {
				//判断是否加载中，避免重复点击请求
				return false
			}
			if (this.phoneData.length != 11) {
				uni.showToast({
					icon: 'none',
					position: 'bottom',
					title: '手机号不正确'
				})
				return false
			}
			if (this.passData.length < 6) {
				uni.showToast({
					icon: 'none',
					position: 'bottom',
					title: '密码小于6位'
				})
				return false
			}
			if (this.verCode.length < 4) {
				uni.showToast({
					icon: 'none',
					position: 'bottom',
					title: '验证码不正确'
				})
				return false
			}
			console.log('重置密码成功')
			_this.isRotate = true
			const params = {
			  account: this.phoneData,
			  pwd: this.passData,
			  code: this.verCode,
			}
			this.$api.updateUserPwd(params).then(res => {
			  if (res.success) {
			    uni.showToast({ title: '重置成功', icon: 'success' })
			    setTimeout(() => {
			      uni.navigateTo({
			          url: '../login/login'
			      })
			    }, 1000)
			  } else {
			    uni.showToast({ title: res.msg, icon: 'none' })
			  }
			  _this.isRotate = false
			}).catch(err => {
				_this.isRotate = false
				uni.showToast({ title: err, icon: 'none' })
			  console.log('request fail', err)
			})
		}
	}
}
</script>

<style lang="scss" scoped>
@import url('@/pages/login/css/main.css');
</style>
